<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>添加页面</title>
    <link href="/static/css/bootstrap.css" rel="stylesheet">
    <script type="text/javascript" src="/static/js/jquery-3.2.1.js"></script>
    <script type="text/javascript" src="/static/js/echarts.js"></script>
</head>
<body>


<form:form cssStyle="text-align: center" method="post" action="add" modelAttribute="main" enctype="multipart/form-data">
    <input type="hidden" name="userId" value="${id}">
    场馆：<select name="xid">
    <option value="">请选择</option>
    </select><br><br>
    项目类型：<select name="yid">
    <option value="">请选择</option>
    </select><br><br>
    场馆场地：<select name="zid">
    <option value="">请选择</option>
    </select><br><br>
    <div id="line">
        <span>
            开始时间：<input type="text" name="infoList[0].startTime">
            结束时间：<input type="text" name="infoList[0].endTime">
            价格：<input type="text" name="infoList[0].price">
            <input type="button" value="-" onclick="delLine(this)">
            <br>
        </span>
    </div>
    <div style="text-align: right">
        <input type="button" value="新增" onclick="addLine(this)">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    </div>
    <br><br>
    <input type="submit" value="保存">
</form:form>


<script type="text/javascript">
    var i = 0;
    //动态添加行
    function addLine(obj){
        i++;
        $("#line").append(`
        <span>
            开始时间：<input type="text" name="infoList[`+i+`].startTime">
            结束时间：<input type="text" name="infoList[`+i+`].endTime">
            价格：<input type="text" name="infoList[`+i+`].price">
            <input type="button" value="-" onclick="delLine(this)">
            <br>
        </span>
        `)
    }
    //删除
    function delLine(obj){
        $(obj).parent().remove();
        i--;
    }




    //下拉框
    $.post(
        "listStadium",
        function (list){
            for (var i in list) {
                $("[name='xid']").append('<option value="'+list[i].xid+'">'+list[i].xname+'</option>');
            }
        }
    );
    $.post(
        "listType",
        function (list){
            for (var i in list) {
                $("[name='yid']").append('<option value="'+list[i].yid+'">'+list[i].yname+'</option>');
            }
        }
    );
    $.post(
        "listPlace",
        function (list){
            for (var i in list) {
                $("[name='zid']").append('<option value="'+list[i].zid+'">'+list[i].zname+'</option>');
            }
        }
    );



</script>


</body>
</html>
